@media (max-width: 1023px)
  html
    background: #fff
  .head
    margin-top: 80px;
  body
    padding-top: 0

@media (max-width: 767px)
  body
    margin: 10px
    margin-bottom: 20px
    margin-top: 0px
    padding: 0
    font-size: font-size-rem($base-font-size-r)

  .head
  .main
  .foot
    width: 100%

  .head
  .foot
    padding: 20px
    height: auto
    line-height: inherit

  .head-title
  .head-nav
  .foot-copy
  .page-menu
    float: none

  .main
    margin-top: 20px
    margin-bottom: 20px

  .head
    margin-top: 20px
    text-align: center

  .head-nav
    margin-top: 10px

  .head-nav__item
    margin: 0 5px
    margin-left: 0

  .post
    margin-top: 20px

  .post__head.archive
  .post__head
    margin: 20px 5px

  .post__main
    margin: 20px 5px
    
  .post__title
  .post__time
    margin: 5px

  .post__title
    font-size-rem(22.4)

  .post__main
    blockquote
    .highlight
      margin: 30px -20px;
      padding: 20px;

  .post__foot
    position: relative
    padding: 10px


  .post__tag
    // display: none
  .post__more
    box-sizing: border-box;
    width: 100%;
    text-align: center;
  .post__image
    margin: 20px -20px
    img
      margin 0 auto
  .foot
    margin-bottom: 0
    text-align: center
  .page-menu
    margin-top: 10px
  .foot bdi
    display: none
  .archive-title
    margin: 20px

  .highlight .code
    padding: 0
